import {View, Button, Text, Image, ScrollView} from '@tarojs/components';
import Taro from '@tarojs/taro';
import React from 'react';
import {connect} from 'react-redux';
import * as T from '../../types';
import './index.less';
import actions from '../../actions';
import {store2Props} from '../../selectors';
import line1 from '@/assets/image/ipland/line1.png';
import line2 from '@/assets/image/ipland/line2.png';
import testImg from '@/assets/image/ipland/test.png';
import LE from '@/assets/image/ipland/LE.png';
import {GAME_URL_SETTING, RECOMMENT_TYPE} from '../../constant';

//@ts-ignore
actions().actions.loadReducer();
//@ts-ignore
@connect<Partial<T.IProps>, any>(store2Props, actions)
export default class personalCenterCenter extends React.Component<Partial<T.IProps>, any> {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {}

  componentWillUnmount() {
    this.props.actions.clean();
  }

  componentWillMount(): void {
    this.props.actions.init();
  }

  componentDidShow() {}

  render() {
    let {productList} = this.props?.main;
    return productList.length > 0 ? (
      <View className="packageIWishingPool-bottom">
        <View className="lineBox">
          <Image className="lineIcon" src={line2} mode="widthFix" />
          <Text className="lineTitle">为您推荐</Text>
          <Image className="lineIcon" src={line1} mode="widthFix" />
        </View>

        <>
          <View className="list">
            <View className="listBox">
              {productList
                .filter((i, index) => index % 2 === 0)
                .map((product, index) => (
                  <View className="listItem" key={'list' + index} onClick={() => this.handleViewProduct(product)}>
                    <Image className="goodImg" src={product.imgUrl} mode="widthFix" />
                    <View className="goodsInfo">
                      {/* <Image className="limited" src={LE} mode="widthFix" /> */}
                      <Text className="goodsName">{product.name}</Text>
                    </View>
                    {product.type == 0 && (
                      <View className="priceBox">
                        <Text className="priceSymbol">￥</Text>
                        <Text className="priceNum">{product.price}</Text>
                      </View>
                    )}
                  </View>
                ))}
            </View>
            <View className="listBox">
              {productList
                .filter((i, index) => index % 2 !== 0)
                .map((product, index) => (
                  <View className="listItem" key={'list' + index} onClick={() => this.handleViewProduct(product)}>
                    <Image className="goodImg" src={product.imgUrl} mode="widthFix" />
                    <View className="goodsInfo">
                      {/* <Image className="limited" src={LE} mode="widthFix" /> */}
                      <Text className="goodsName">{product.name}</Text>
                    </View>
                    {product.type == 0 && (
                      <View className="priceBox">
                        <Text className="priceSymbol">￥</Text>
                        <Text className="priceNum">{product.price}</Text>
                      </View>
                    )}
                  </View>
                ))}
            </View>
          </View>
        </>
      </View>
    ) : (
      <></>
    );
  }

  /**
   * 点击详情
   */
  handleViewProduct = (item) => {
    // 商品详情
    if (item.type == RECOMMENT_TYPE['product']) {
      Taro.navigateTo({
        url: '/pages/package-B/goods/goods-details/index?skuId=' + item.goodsInfoId,
      });
    } else {
      // let url = GAME_URL_SETTING[Number(item.gameType)].url
      let url = '/pages/package-I/home/index';
      Taro.navigateTo({
        url,
      });
    }
  };
}
